window.addEventListener("load", function () {
  var focus = document.querySelector(".focus");
  var ul = focus.children[0];
  var focusWidth = focus.offsetWidth;
  var index = 0;
  var ol = focus.querySelector("ol");
  var timer = setInterval(function () {
    index++;
    // console.log(index.jsx);
    ul.style.transition = "all .3s";
    ul.style.transform = "translateX(" + -index * focusWidth + "px)";
  }, 2000);
  ul.addEventListener("transitionend", function () {
    if (index >= 3) {
      index = 0;
      ul.style.transition = "none";
      ul.style.transform = "translateX(" + -index * focusWidth + "px)";
    }
    if (index < 0) {
      index = 2;
      ul.style.transition = "none";
      ul.style.transform = "translateX(" + -index * focusWidth + "px)";
    }
    for (let i = 0; i < ol.children.length; i++) {
      ol.children[i].classList.remove("current");
      ol.children[i].style.transition = "all 0.3s";
    }
    ol.children[index].classList.add("current");
  });
  var startX = 0; //手指初始位置
  var moveX = 0; //移动距离
  var flag = false;
  ul.addEventListener("touchstart", function (e) {
    startX = e.targetTouches[0].pageX;
  });
  ul.addEventListener("touchmove", function (e) {
    moveX = e.targetTouches[0].pageX - startX;
    var translatex = -index * focusWidth + moveX; //原来的位置加上移动的位置
    ul.style.transition = "none";
    ul.style.transform = "translateX(" + translatex + "px)";
    e.preventDefault();
    clearInterval(timer);
    flag = true;
  });
  ul.addEventListener("touchend", function () {
    if (flag) {
      if (Math.abs(moveX) > 50) {
        if (moveX > 0) {
          index--;
        } else index++;
        ul.style.transition = "all .3s";
        ul.style.transform = "translateX(" + -index * focusWidth + "px)";
      } else {
        ul.style.transition = "all .3s";
        ul.style.transform = "translateX(" + -index * focusWidth + "px)";
      }
      clearInterval(timer);
      timer = setInterval(function () {
        index++;
        // console.log(index.jsx);
        ul.style.transition = "all .3s";
        ul.style.transform = "translateX(" + -index * focusWidth + "px)";
      }, 2000);
    }
  });

  var goBack = document.querySelector(".goBack");
  var nav = document.querySelector(".local-nav");
  window.addEventListener("scroll", function () {
    // console.log(window.scrollY);
    if (window.scrollY >= nav.offsetTop) {
      goBack.style.display = "block";
    } else goBack.style.display = "none";
  });
  goBack.addEventListener("click", function () {
    window.scroll(0, 0);
  });
});
